<!DOCTYPE html>
<!-- 
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.1.1
Version: 2.0.2
Author: KeenThemes
Website: http://www.keenthemes.com/
Contact: support@keenthemes.com
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
-->
<!--[if IE 8]>
<html lang="en" class="ie8 no-js">
	<![endif]-->
	<!--[if IE 9]>
	<html lang="en" class="ie9 no-js">
		<![endif]-->
		<!--[if !IE]>
		<!-->
		<!--<![endif]-->
		<!-- BEGIN HEAD -->
		<link rel="stylesheet" href="./assets/css/site.css"/>
		<style type="text/css">
		.page-content{
			background-color: #fff;
		}
		.site_content div{
			list-style: none;
			margin: 0;
			padding: 0;
			font-family: Microsoft Yahei;
			display: block;
		}
		.site_content .tab_box {
			font-size: 16px;
			height: 70px;
			line-height: 70px;
			/*padding-left: 25px;*/
			background-color: #fff;
		}
		.site_content {
			height: auto;
			border-top: 0;
		}
		.tab_box .tab_tit.active, .tab_box .tab_tit.active:hover {
			color: #009fcd;
			border-bottom: 2px solid #009fcd;
			cursor: inherit;
		}
		.tab_box .tab_tit {
			display: inline-block;
			padding: 0 40px;
			cursor: pointer;
		}
		.site_content .add_export {
			float: right;
			width: 250px;
			height: 20px;
			margin-top: 10px;
		}
		.site_content .add_export #export {
			background: #019fce;
		}
		.site_content .add_export input {
			line-height: 20px;
			border: 1px;
			font-size: 15px;
			color: #FFFFFF;
			border-radius: 4px;
			background: #f3f3f3;
			float: right;
			margin-right: 15px;
			padding: 5px;
			cursor: pointer;
		}
		.site_content .add_export #add_site {
			background: #88888a;
		}
		.lightDiv{
			border: solid 3px rgba(1, 160, 207, 0);

		}
		p{
			font-size:16px;
		}
	#operate1 input[type="button"]{
		background-color: #01a0cf;
		position: absolute;top: 50px;right: 115px;width: 78px;height: 31px;
	}
	#operate1 input[type="button"]:hover{
		background-color: #f3f3f3;
		color:#000;
	}
	.foot{
		background: #fff;

	}
	.foot p{
		font-size: 13px;
	}
	</style>
		<!-- BEGIN BODY -->
<body class="page-header-fixed">
		<div class="site_content" id="tab_div">
			<!--<div class="tab_box">
			-->
			<div class="content_box">
				<div class="tabbable tabbable-custom tabbable-full-width">
					<ul class="nav nav-tabs">
						<li ng-class="{active:tabFlag=='normal'}">
							<a href="javascript:;" ng-click="tabFlag='normal';changeSelectedStatus('dz_qb');">正常电桩</a>
						</li>
						<li ng-class="{active:tabFlag=='malfunction'}">
							<a href="javascript:;" 
								ng-click="tabFlag='malfunction';changeSelectedStatus('dz_gz');">故障电桩</a>
						</li>
						<span class="add_export">
							<input type="button" id="export" value="数据导出" ng-click="exportAcPile();"/>
						</span>
					</ul>
					<div class="tab-content">
						<div class="tab-pane active" id="tab_1_1">
							<div class="realtime_content tab_div">
								<div class="dzgl_state tab1 bg_white">
									<div id="dz_qb" ng-class="{lightDiv:selectedStatus=='dz_qb'}" ng-if="tabFlag=='normal'"
										ng-click="changeSelectedStatus('dz_qb');">
										<div class="bg_white bd" id='count'>
											<img src="./assets/img/evcharger/orange.jpg"> <font class="c_orange" ng-bind="allACPileStatus.total"></font>
										</div>
										<p class="c_white bg_orange">全部</p>
									</div>
									<div id="dz_kx" ng-class="{lightDiv:selectedStatus=='dz_kx'}" ng-if="tabFlag=='normal'"
										ng-click="changeSelectedStatus('dz_kx');">
										<div class="bg_white bd" id="release">
											<img src="./assets/img/evcharger/green.jpg"> <font class="c_green" ng-bind="allACPileStatus.free_no"></font>
										</div>
										<p class="c_white bg_green" >空闲</p>
									</div>
									<div id="dz_cd" ng-class="{lightDiv:selectedStatus=='dz_cd'}" ng-if="tabFlag=='normal'"
										ng-click="changeSelectedStatus('dz_cd');">
										<div class="bg_white bd" id="charge">
											<img src="./assets/img/evcharger/blue.jpg">
											<font class="c_blue" ng-bind="allACPileStatus.charge_no"></font>
										</div>
										<p class="c_white bg_blue" >充电</p>
									</div>
									<div id="dz_yy" ng-class="{lightDiv:selectedStatus=='dz_yy'}" ng-if="tabFlag=='normal'"
										ng-click="changeSelectedStatus('dz_yy');">
										<div class="bg_white bd" id="bespeak">
											<img src="./assets/img/evcharger/yellow.jpg">
											<font class="c_yellow" ng-bind="allACPileStatus.bespeak_no"></font>
										</div>
										<p class="c_white bg_yellow" >预约</p>
									</div>
									<div id="dz_lx" ng-class="{lightDiv:selectedStatus=='dz_lx'}" ng-if="tabFlag=='normal'"
										ng-click="changeSelectedStatus('dz_lx');">
										<div class="bg_white" id="offline">
											<img src="./assets/img/evcharger/grayblue.jpg">
											<font class="c_blueGray" ng-bind="allACPileStatus.offline_no"></font>
										</div>
										<p class="c_white bg_blueGray" >离线</p>
									</div>
									<div id="dz_gz" ng-class="{lightDiv:selectedStatus=='dz_gz'}" ng-if="tabFlag=='malfunction'" ng-click="changeSelectedStatus('dz_gz');">
										<div class="bg_white" id='error'>
											<img src="./assets/img/evcharger/gray.png">
											<font class="c_gray" ng-bind="allACPileStatus.error_no"></font>
										</div>
										<p class="c_white" style="background-color:#aaa" >故障</p>
									</div>
								</div>
								<hr style="margin: 0" />
								<search-data></search-data>
								<table class="table table-striped table-bordered table-hover" id="table_1">
									<thead>
										<tr>
											<th style="padding-bottom: 12px;padding-top: 0">
												<input type="checkbox" class="checkbox_table" />
											</th>
											<th>电桩ID</th>
											<th>运营二维码</th>
											<th>站点名称</th>
											<th>站点所在地</th>
											<th>站内编号</th>
											<th>电桩状态</th>
											<th>操作</th>
										</tr>
	
									</thead>
									<tbody>
										<tr ng-repeat="ACP in ACPileList  track by $index" pg-loaded="{{$last}}" target-table="table_1">
											<td>
												<input type="checkbox" class="checkbox_table" name="chargerRowModel"
											 value="{{ACP.charger_id}}" />
											</td>
											<td>
												<span ng-bind="ACP.charger_id"></span>
											</td>
											<td>
												<span ng-bind="ACP.qr_code" ng-if="!!ACP.qr_code"></span>
												<a class="btn" href="javascript:;" ng-if="!!!ACP.qr_code" ng-click="generateQrCode(ACP);">生成并下发二维码</a>
											</td>
											<td>
												<span ng-bind="ACP.station_name"></span>
											</td>
											<td>
												<span ng-bind="ACP.district_name"></span>

											</td>
											<td>
												<span ng-bind="ACP.serial_no"></span>

											</td>
											<td>
												<span ng-repeat="chargeStatus in ACP.chargeStatusList track by $index" ng-class="{greenFont:chargeStatus==0,
	                                            yellowFont:chargeStatus==1,
	                                            blueFont:chargeStatus==2,
	                                            gredFont:chargeStatus==3,
	                                            darkBlueFont:chargeStatus==8}">
													{{$index | getValueInStaticFilter : 'chargeInterfaceArray' }}
													{{chargeStatus | getValueInStaticFilter : 'chargeStatusArray' }}
													<span ng-if="!$last">/</span>
												</span>
											</td>
											<td style="padding: 0">
												<a class="btn" data-target="#" href="index.html#/ACPileDetail/交流桩详情/电桩管理/ACPileDetail/{{ACP.charger_id}}">查看</a>
											</td>
										</tr>
									</tbody>
								</table>
								<tm-pagination conf="paginationConf"></tm-pagination>
								<div class="operate" id="operate1">
									<input type="button" value="批量删除" class="all_delete"  
										ng-click="batchDeleteACPile();" />
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

</body>
		<!-- END BODY -->
	</html>